<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>Tweet Active</title>
        <meta name="copyright" content="(c) Markandey Singh 2009"/>
        <meta name="keywords" content="twitter,REST, API, realtime, search, tweetactiveindex, activeness, friends"/>
        <meta name="description" content="Get real time tweets, know your friedns activeness on twitter and many more"/>

        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?2.7.0/build/reset-fonts-grids/reset-fonts-grids.css"/>
        <script type="text/javascript" src="http://yui.yahooapis.com/combo?2.7.0/build/yahoo/yahoo-min.js&2.7.0/build/dom/dom-min.js"></script>
        <script src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js" type="text/javascript"></script>
        <script src="http://yui.yahooapis.com/2.7.0/build/animation/animation-min.js" type="text/javascript"></script>
        <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/get/get-min.js" ></script> 
        <style type="text/css">
            a:link,a:visited
            {
                color: #aaaaaa;
            }
            a:link:hover
            {
                color: #ffffff;
            }
            body, html {
                background: #e0e0e0;
                color: #000;
            }
			#page_title {
                font-size: 48px;
				color:#2222ff;
				font-family: 'Arial Rounded MT Bold';
            }
			#tweet_list {
                font-size: 28px;
				color:#909090;
				font-family:Times;
            }
			#doc3 {
                background: #000000;
                border: 1em solid #fff;
                border-radius: 5px;
                -moz-border-radius: 5px;
                -webkit-border-radius: 5px;
                margin: 1em auto;
                position: relative;
            }
            #seperator
            {
                width:1024px;
                height:2px;
                background-color: gray;
            }
            #trend_list
            {
                width:1024px;
                height:auto;
                font-size: 28px;
				color:#2222ff;
				font-family:Times;
                overflow: hidden;
            }
			.me
			{
				color:#CC9900;
				font-size:28px;
				font-family:'Arial Rounded MT Bold';
			}
            .displayed,.yui-g
            {
                width:auto;
                height:auto;
                font-size: 18px;
				color:#909090;
				font-family:Times;
                overflow: hidden;
            }
			</style>
        <script type="text/javascript" language="JavaScript">
            var KeyWord = 'twitter';

            var RealKeywordDisplay = {
                /*callbacks : {
                            success : function (o) {
                                // Process the JSON data returned from the server
                                var values = [];
                                try {
                                    values = YAHOO.lang.JSON.parse(o.responseText).ResultSet.Result;
                                }
                                catch (e) {
                                    return;
                                }
                               RealKeywordDisplay.disp(values);
                            },

                            failure : function (o) {
                                if (!YAHOO.util.Connect.isCallInProgress(o)) {
                                }
                            },

                            timeout : 3000
                           },*/
                currentpane: 1,
                setvisible: function(id, visible) {
                    ele = document.getElementById(id);
                    if (visible) {
                        myAnim = new YAHOO.util.Anim(id, {
                            width: {
                                from: 1024,
                                to: 1024
                            },
                            height: {
                                to: 350
                            },
                            opacity: {
                                from: 0,
                                to: 1
                            }
                        },
                        1, YAHOO.util.Easing.easeIn);
                        myAnim.anim
                        ele.className = "displayed";
                        myAnim.animate();
                    }
                    else {
                        var myAnim = new YAHOO.util.Anim(id, {
                            width: {
                                from: 0,
                                to: 0
                            },
                            height: {
                                to: 0
                            },
                            opacity: {
                                from: 1,
                                to: 0
                            }
                        },
                        1, YAHOO.util.Easing.easeIn);
                        myAnim.animate();

                    }

                },
                getfreepane: function() {
                    if (this.currentpane == 1) {

                        var cur_pane = document.getElementById("pane1");
                        this.setvisible("pane1", false);
                        this.currentpane = 2;
                        cur_pane = document.getElementById("pane2");
                        this.setvisible("pane2", true);
                        return cur_pane;
                    }
                    else {
                        var cur_pane = document.getElementById("pane2");
                        this.setvisible("pane2", false);
                        this.currentpane = 1;
                        cur_pane = document.getElementById("pane1");
                        this.setvisible("pane1", true);
                        return cur_pane;
                    }
                },
                URLEncode: function(clearString) {
                    var output = '';
                    var x = 0;
                    clearString = clearString.toString();
                    var regex = /(^[a-zA-Z0-9_.]*)/;
                    while (x < clearString.length) {
                        var match = regex.exec(clearString.substr(x));
                        if (match != null && match.length > 1 && match[1] != '') {
                            output += match[1];
                            x += match[1].length;
                        } else {
                            if (clearString[x] == ' ') output += '+';
                            else {
                                var charCode = clearString.charCodeAt(x);
                                var hexVal = charCode.toString(16);
                                output += '%' + (hexVal.length < 2 ? '0': '') + hexVal.toUpperCase();
                            }
                            x++;
                        }
                    }
                    return output;
                },
                seedscript: function(source_url) {
                    var scrpt_div = document.getElementById("MYSCRIPTS");
                    scrpt_div.innerHTML = "";
                    var scrpt_ele = document.createElement("script");
                    scrpt_ele.src = source_url;
                    scrpt_div.appendChild(scrpt_ele);
                },
                chart_color: ["#802B00", "#806A00", "#2B0080", "#6A0080", "#558000", "#7C00DB", "#336699", "#88C700", "#999933", "#CC9900"],
                timer_tick: function() {
                    var url = "http://search.twitter.com/search.json?q=" + RealKeywordDisplay.URLEncode(KeyWord);
                    RealKeywordDisplay.seedscript(url + "&callback=RealKeywordDisplay.disp");
                    //YAHOO.util.Get.script(url, RealKeywordDisplay.callbacks);
                },
                setcustom: function() {
                    var text = document.getElementById("txtkeyword").value;

                    text = text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');

                    RealKeywordDisplay.ChangeQuery(text);
                    //document.getElementById("txtkeyword").value="";
                },
                ChangeQuery: function(query) {
                    KeyWord = query;
                    var div_title = document.getElementById("page_title");
                    div_title.innerHTML = 'Real Time <font color=\"#CC9900\">' + KeyWord + '<' + '/font>';
                    RealKeywordDisplay.timer_tick();
                },
                trend_disp: function(data) {
                    RealKeywordDisplay.chart_color.sort(function() {
                        return 0.5 - Math.random()
                    });
                    var tl = document.getElementById("trend_list");
                    var html = "";
                    for (var i = 0; i < data.trends.length; i++) {
                        var link_tag = '<a style=\"text-decoration:none\" href=\"javascript:RealKeywordDisplay.ChangeQuery(\'' + data.trends[i].name + '\')\">';
                        var font_start_tag = "<font color=\"" + RealKeywordDisplay.chart_color[i % RealKeywordDisplay.chart_color.length] + "\">";
                        var tweet = data.trends[i].name
                        html = html + link_tag + font_start_tag + tweet + "</font>" + "</a>&nbsp";

                    }
                    tl.innerHTML = html;
                    RealKeywordDisplay.timer_tick();
                },
                navigate_link: function(in_link) {
                    if (in_link.match(/#[A-Za-z0-9_]+/)) {
                        RealKeywordDisplay.ChangeQuery(in_link);
                    }
                    else if (in_link.match(/(http:\/\/[A-Za-z0-9\/\.\+\-]+)/)) {
                        window.open(in_link);
                    }
                    else if (in_link.match(/@[A-Za-z0-9_]+/)) {
                        window.open("http://www.twitter.com/" + in_link.substring(1));
                    }
                },
                get_trend_list: function() {
                    var url = "http://search.twitter.com/trends.json" + "?callback=RealKeywordDisplay.trend_disp";
                    RealKeywordDisplay.seedscript(url);
                },
                get_anchor_link: function() {
                    //alert(RealKeywordDisplay.cur_color);
                    var link_tag = '<a style=\"text-decoration:none\" href=\"javascript:RealKeywordDisplay.navigate_link(\'' + '$1' + '\')\">';
                    var font_tag = "<font color=\"" + RealKeywordDisplay.cur_color + "\">";
                    var endtag = "</font></a>";
                    return link_tag + font_tag + '$1' + endtag;
                },
                cur_color: "#802B00",
                getHTML: function(data) {

                    var html = "";
                    for (var i = 0; i < data.results.length; i++) {
                        RealKeywordDisplay.cur_color = RealKeywordDisplay.chart_color[i % RealKeywordDisplay.chart_color.length];

                        var font_start_tag = "<font color=\"" + RealKeywordDisplay.cur_color + "\">";
                        /*var img_tag="<img src=\""+data.results[i].profile_image_url+"\"/>"*/
                        var user_tag = '<a style=\"text-decoration:none\" href=\"javascript:RealKeywordDisplay.navigate_link(\'@' + data.results[i].from_user + '\')\">' + data.results[i].from_user + ":</a>";
                        var tweet = data.results[i].text
                        /*'g' at the end of the regex is to indicate
                                     *global replace i.e replace all occurance
                                     *
                                     *DO NOT MESS WITH THE ORDER OF REPLACEMENTS*/
                        var tweet_strip_link = tweet.replace(/(http:\/\/[A-Za-z0-9\/\.\+\-]+)/g, RealKeywordDisplay.get_anchor_link());
                        var tweet_strip_hastag = tweet_strip_link.replace(/ (#[A-Za-z0-9_]+)/g, ' ' + RealKeywordDisplay.get_anchor_link());
                        var tweet = tweet_strip_hastag.replace(/(@[A-Za-z0-9_]+)/g, RealKeywordDisplay.get_anchor_link());
                        if (tweet.length > 5) {
                            html = html + user_tag + font_start_tag + tweet + "</font><br>";
                        }

                    }
                    return html;
                },
                cur_tweet_id: 0,
                disp: function(data) {
                    var html = RealKeywordDisplay.getHTML(data);
                    if (RealKeywordDisplay.cur_tweet_id != data.results[0].id) {
                        var tl = this.getfreepane();
                        RealKeywordDisplay.chart_color.sort(function() {
                            return 0.5 - Math.random()
                        });
                        tl.innerHTML = RealKeywordDisplay.getHTML(data);
                        RealKeywordDisplay.cur_tweet_id = data.results[0].id;
                    }

                },
                DoReload: function() {
                    window.location.reload();
                },
                launch: function() {

                    setInterval(RealKeywordDisplay.timer_tick, 8000);
                    setInterval(RealKeywordDisplay.DoReload, 1200000);
                    var div_title = document.getElementById("page_title");
                    div_title.innerHTML = 'Real Time <font color=\"#CC9900\">' + KeyWord + '<' + '/font>';
                    this.get_trend_list();
                }
            }
        </script>
    </head>
    <body onload="RealKeywordDisplay.launch()">
        <div id="doc3" class="yui-t7">
            <div id="hd">
                <div class="yui-g">
                    <div id="page_title">
                        
                    </div>
                </div>
            </div>
            <div id="trend_list">
                Loading trend list...
            </div>
            <div>
                <form  action="javascript:RealKeywordDisplay.setcustom()">
                <input id="txtkeyword" type="text"></input>
                <input type="submit" onclick="RealKeywordDisplay.setcustom()" value="search">search</input>"
                </form>
            </div>
            <div>
            <script type="text/javascript"><!--
            google_ad_client = "pub-4399838251921825";
            /* 728x90, created 4/10/09 */
            google_ad_slot = "0338658826";
            google_ad_width = 728;
            google_ad_height = 90;
            //-->
            </script>
            <script type="text/javascript"
            src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
            </script>
            </div>
            <div id="seperator">
                
            </div>
            <div>
                <div class="yui-g" id="pane1">
                    Loading....
                </div>
                <div class="yui-g" id="pane2">
                </div>
            </div>
			<div id="MYSCRIPTS">
            </div>
            <div id="seperator">

            </div>
            <div><a href="/feedback">feedback</a></div>
            <div id="ft">
            	<div class="me">
                	MashUp Created by:: <a href="http://www.twitter.com/markandey">Markandey</a>
				</div>
                <div><a href="http://www.markandey.com/2009/04/chill-yourself-and-use-tweetactive-api.html">TweetActive Badge and APIs</a></div>
                <div>
                    <img src="http://code.google.com/appengine/images/appengine-noborder-120x30.gif"
alt="Powered by Google App Engine" />
                       <img src="http://search.twitter.com/images/powered-by-twitter-sig.gif?1220915084"
alt="Powered by Twitter Search API" />
                </div>
            </div>
        </div>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-109368-4");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html>

